<template>
 <div class="user_score pd_40">
   <div>
     <el-row :gutter="40">
      <el-col :span="7">
        <div class="fsc">
          <span class="articlelist_lable">旅说内容</span>
          <el-input
            placeholder="请输入"
            v-model="tableData.content">
          </el-input> 
        </div>
      </el-col>
      <el-col :span="8">
        <div class="fsc">
          <span class="articlelist_lable">发布时间</span>
          <el-date-picker
                class="articlelist_lable_time"
                v-model="tableData.start"
                v-on:change = 'upDateTime'
                type="datetime"
                placeholder="选择日期时间">
              </el-date-picker>
            <span>-</span>
              <el-date-picker
                class="articlelist_lable_time"
                v-on:change = 'upDateTime'
                v-model="tableData.end"
                type="datetime"
                placeholder="选择日期时间">
              </el-date-picker>
        </div>
      </el-col>
      <el-col :span="7">
        <div class="fsc">
          <span class="articlelist_lable">帖子状态</span>
          <el-select v-model="tableData.downline">
            <el-option
              v-for="(item,index) in opStatus"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </div>
      </el-col>
      <el-col :span="7" class="mg_t30">
        <div class="fsc">
          <span class="articlelist_lable">帖子分类</span>
          <el-select v-model="tableData.expert">
            <el-option
              v-for="(item,index) in isClass"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </div>
      </el-col>
      <el-col :span="8" class="mg_t30">
        <div class="fsc">
          <span class="articlelist_lable">是否加精</span>
          <el-select v-model="tableData.status">
            <el-option
              v-for="(item,index) in isRefinement"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </div>
      </el-col>
     </el-row>
     <p class="articlelist_query fec">
      <el-button @click="reset()">重置</el-button>
      <el-button @click="centerDialogVisible=true,getTime()"  type="success">设置过审时间</el-button>
      <el-button @click="getList('query')" type="primary">查询</el-button>
    </p>
   </div>
   <div>
     <el-table
      :data="tableList"
      style="width: 100%">
      <el-table-column
        prop="id"
        width="70"
        label="动态ID">
      </el-table-column>
      <el-table-column
        align="center"
        width="200"
        label="发布时间">
        <template slot-scope="scope">
          <span>{{getdates(scope.row.createtime)}}</span>
        </template>
      </el-table-column>
      <el-table-column
        width="250"
        prop="content"
        label="旅说内容详情">
      </el-table-column>
      <el-table-column
        width="150"
        label="旅拍图片">
        <template slot-scope="scope">
          <div>
            <img class="say_list_img" v-for="(item,index) in addImg(scope.row.images)" :key="index" :src="item" alt="做客">
          </div>
        </template>
      </el-table-column>
      <el-table-column
        width="150"
        align="center"
        label="帖子分类">
        <template slot-scope="scope">
          <span>{{scope.row.expert==0?"普通":'达人'}}</span>
        </template>
      </el-table-column>
      <el-table-column
        align="center"        
        width="150"
        label="状态">
        <template slot-scope="scope">
            <div>{{isdownline(scope.row.downline)}}</div>
        </template>
      </el-table-column>
      <el-table-column
        align="center"        
        width="150"
        label="加精状态">
        <template slot-scope="scope">
            <div>{{scope.row.status==0?'未加精':'已加精'}}</div>
        </template>
      </el-table-column>
      <el-table-column
        align="center"        
        width="150"
        label="置顶状态">
        <template slot-scope="scope">
            <div>{{scope.row.top==0?'未置顶':'已置顶'}}</div>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        width="130"
        label="个人信息">
        <template slot-scope="scope">
          <el-button @click="moreUsermaAlert = true" type="primary" size="small">查看</el-button>
        </template>
      </el-table-column>
      <el-table-column
        width="400"
        label="操作">
        <template slot-scope="scope">
          <div class="nowrap">
            <el-button @click="administration(scope)" type="primary" size="small">管理</el-button>
            
            <!--<el-button @click="refinement(scope.row.status,scope.row.id)" type="success" size="small">{{scope.row.status==0?'加精':'取消加精'}}</el-button>
            <el-button @click="isTop(scope.row.top,scope.row.id)" type="warning" size="small">{{scope.row.top==0?'置顶':'取消置顶'}}</el-button>
            <el-button @click="isOffline(scope.row.top,scope.row.id)" type="primary" size="small">{{scope.row.downline==0?'下线':'上架'}}</el-button>-->
            <el-button  @click="deleteOpen(scope.row.id)" type="danger" size="small">删帖</el-button>
          </div>
        </template>
      </el-table-column>
    </el-table>
   </div>
  <div class="block fec mg_t30">
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page.sync="current"
      :page-sizes="[10]"
      :page-size="10"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total">
    </el-pagination>
  </div>

  <!--设置过审时间alert-->
  <el-dialog
    title="设置过审时间"
    :visible.sync="centerDialogVisible"
    width="400px"
    center>
    <div class="mg_20 fbc fwrap f_13">
      <el-input type="text" v-model.trim="dialog.min" placeholder="输入延迟显示的分钟数/min"></el-input>
      <span class="mg_t20">{{time}}</span>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button size="small" @click="centerDialogVisible=false">取消</el-button>
      <el-button type="primary" size="small" @click="sureTime()">确定</el-button>
    </span>
  </el-dialog>

  <!--alert-->
  <el-dialog
    title="更多用户信息"
    :visible.sync="moreUsermaAlert"
    width="30%"
    center>
    <div class="fbc fwrap f_13">
      
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" size="small" @click="moreUsermaAlert=false;">关闭</el-button>
    </span>
  </el-dialog>

   <!--管理alert-->
   <el-dialog
    title="提示"
    :visible.sync="centerDialogVisible2"
    width="600px"
    center>
    <div class="fbc mg_t30 mg_b20">
      <el-button @click="index=1" :type="index==1?'primary':''">{{this.dialog.top==0?'置顶':'取消置顶'}}</el-button>
      <el-button @click="index=2" :type="index==2?'primary':''">{{this.dialog.status==0?"加精":"取消加精"}}</el-button>
      <el-button :disabled="!dialog.downline==0" @click="index=3" :type="index==3?'primary':''">{{this.dialog.downline==0?'下线':'已下线'}}</el-button>
      <!--<el-button @click="index=4" :type="index==4?'primary':''">{{this.dialog.type==0?'设为达人':'取消达人'}}</el-button>-->
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="centerDialogVisible2 = false">取 消</el-button>
      <el-button type="primary" @click="sure()">确 定</el-button>
    </span>
  </el-dialog>
 </div>

</template>
<script>
export default {
  data() {
    return {
      index: 1,    //dialog里button
      time: '',   //过审时间
      tableList: [],      //表格数据
      total: null, //总条数
      current: 1,
      centerDialogVisible: false,  //时间过审时间弹框
      centerDialogVisible2: false,  //管理弹窗
      moreUsermaAlert: false,
      tableData: {      //表格参数
        content: '',
        start: '',
        end: '',
        status: '',
        expert: '',
        downline: '',
        page: '',
      },
      dialog: {    
        min: '',
      },
      getdates: this.$utils.getdates,

      isClass: [{
        value: '',
        label: '全部'
      }, {
        value: 0,
        label: '普通'
      }, {
        value: 1,
        label: '达人'
      }],
      dialog2: {       //管理参数
        did: '',
        downline: '',
        status: '',
        top: '',
        type: '',
      },
      opStatus: [{
          value: '',
          label: '全部'
        }, {
          value: 0,
          label: '正常'
        }, {
          value: 1,
          label: '下线'
      },{
          value: 2,
          label: '待审核'
      },],
      isRefinement: [{
          value: '',
          label: '全部'
        }, {
          value: 1,
          label: '加精'
        }, {
          value: 0,
          label: '未加精'
      }],
    }
  },
  created() {
    this.getList();
    this.getTime();
  },  
  methods: {
    addImg(data) {
      let imgList = JSON.parse(data)[0];
      let img = imgList.split(',');
      return img

    },

    getList(label) {     //获取list
      if(label == 'query') {
        this.tableData.page = 1;
        this.current = 1;
      }
      let url = '/admin/dynamic/lists';
      let data = this.tableData;
      this.$request.post(url,data).then(res=> {
        console.log(res)
        if(res.data.code == '0000') {
          this.tableList = res.data.data.list
          this.total = res.data.data.page.total
        }else {
          this.$message.error('获取列表失败')
        }
      })
    }, 
    isdownline(downline) {
      if(downline == 0) {
        return '正常'
      }else if(downline == 1) {
        return '下线'
      }else if(downline == 2) {
        return '待审核'
      }
    },
    administration(scope) {           //管理
      let row = scope.row;
      this.dialog.did = row.id;
      this.dialog.top = row.top;
      this.dialog.status = row.status;
      this.dialog.downline = row.downline;
      this.dialog.type = row.type;
      this.centerDialogVisible2 = true;
    },
    getTime() {
      let url = 'admin/Dynamic/gettime';
      let data = {};
      this.$request.post(url,data).then(res => {
        console.log(res)
        if(res.data.code == '0000') {
          this.time = res.data.data / 60
          
        }
      })
    },
    sure() {
      let { top, status,downline, type, did } = this.dialog;
      let is;
      let label;
      if(this.index == 1) {
        is = top==0?1:0; 
        label = 'top'
      }else if(this.index == 2) {
        is = status==0?1:0
        label = 'status';
      }else if(this.index == 3) {
        is = downline==0?1:0
        label = 'downline'
      }else if(this.index == 4) {
        is = type==0?1:0;
        label = 'type';
      }
      let url = '/admin/dynamic/top';
      let data = {
        is,
        did,
        type: label
      }
      this.$request.post(url,data).then(res=> {
        if(res.data.code == '0000') {
            this.$message({
              type: 'success',
              message: '操作成功'
            })
            this.centerDialogVisible2 = false;
            this.getList();
        }else {
          this.$message.error('操作失败')
        }
      }).catch(err=> {
        console.log(err);
        this.$message.error('操作失败')
      })

    },

    sureTime() {           //设置过审时间
      let url = '/admin/dynamic/settime';
      let data = this.dialog;
      if(this.dialog.min) {
        this.$request.post(url, data).then(res => {
          console.log(res)
          if(res.data.code == '0000') {
            this.$message({
              type: 'success',
              message: '操作成功'
            })
            this.centerDialogVisible = false
          }else {
            this.$message.error(res.data.message)
          }
        }).catch(err => {
          this.$message.error('操作错误')
        })
      }
    },
    // isTop(type1,did) {
    //   let url = '/admin/dynamic/top';
    //   type1 = type1==1?0:1;
    //   let data = {
    //     did,
    //     is: type1,
    //     type: 'top'
    //   };
    //   this.$confirm('确定继续操作','提示',{
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消'
    //   }).then(()=> {
    //     this.$request.post(url,data).then(res=> {
    //       if(res.data.code == '0000') {
    //         this.$message({
    //           type: 'success',
    //           message: '操作成功'
    //         })
    //         this.getList()
    //       }
    //     }).catch(err=> {
    //       console.log(err)
    //       this.$message.error('操作错误')
    //     })
    //   })
    // },
    // refinement(type1,did) {
    //   console.log(type1,did)
    //   type1 = type1==1?0:1;
    //   let url = '/admin/dynamic/top';
    //   let data = {
    //     did,
    //     is: type1,
    //     type: 'status'
    //   };
    //   this.$confirm('确定继续操作','提示',{
    //       confirmButtonText: '确定',
    //       cancelButtonText: '取消'
    //     }).then(()=> {
    //       this.$request.post(url,data).then(res=> {
    //         if(res.data.code == '0000') {
    //           this.$message({
    //             type: 'success',
    //             message: '操作成功'
    //           })
    //           this.getList()
    //         }else{
    //           this.$message.error('操作失败')
    //         }
    //       }).catch(err=> {
    //         console.log(err)
    //         this.$message.errors('操作错误')
    //       })
    //     })
    // },
    // isOffline(type1,did) {
    //   type1 = type1==0?1:0;
    //   let url = '/admin/dynamic/top';
    //   let data = {
        
    //   }
    // },
    reset() {               //重置
      this.tableData.content = '';
      this.tableData.downline = '';
      this.tableData.expert = '';
      this.tableData.start = '';
      this.tableData.end = '';
      this.tableData.status = '';
      this.getList('query')
    },
    upDateTime() {           //判断时间输入
      if(this.tableData.end) {
        if(this.tableData.start - this.tableData.end > 0) {
          this.$message.error('时间输入错误')
        }
      }
    },
    
    isStatus(status) {
      if(status == 0) {
        return '正常'
      }else if(status == 1) {
        return '加精'
      }else if(status == 2) {
        return '下线'
      }
    },
    deleteOpen(id) {
      this.$confirm('确定要删除这个帖子', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let url = '/admin/dynamic/del';
        let data = {did:id};
        this.$request.post(url,data).then(res=> {
          if(res.data.code == '0000') {
           this.$message({
             type: 'success',
             message: '删除成功!'
           });
          }else {
            this.$message.error('删除失败')
          }
          this.getList()
        }).catch(err=> {
          this.$message.error('操作错误')
        })
       
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });          
      });
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.tableData.page = val;
      this.getList()
    },
  },
  
}
</script>
<style scoped lang="less">
  .articlelist_lable {
    min-width: 20%;
    white-space: nowrap;
  }
  .articlelist_query {
    margin-right: 100px;
    height: 100px;
  }
  .user_img {
    width: 50px;
    height: 50px;
  }
  .user_dialog_desc {
    height: 60px;
    border-bottom: 1px solid #999;
  }
  .user_dialog_quan {
    height: 100px;
  }
  .say_list_img {
    width: 30px;
    max-height: 40px;
    margin: 2px;
  }
</style>

